<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登陆</title>
    <link rel="stylesheet" href="../../static/css/login.css">
    <script src="../../static/js/jquery-3.4.1.min.js"></script>
    <script>
        $(function () {
            $('#imgLogin').click(function () {
                username = $('#username').val();
                password = $('#password').val();
                remember = $('#remember').val();
                var csrfToken = $("[name='csrfmiddlewaretoken']").val();
                $.ajax({
                    url: '/smdo/login_check_ajax',
                    type: 'post',
                    data: {
                        'username': username,
                        'password': password,
                        'remember': remember,
                        'csrfmiddlewaretoken': csrfToken,
                    },
                    datatype: 'json',
                    xhrFields: {
                        withCredentials: true
                    },
                    success: function (data) {
                        if (data.res == 0) {
                            $('#errormsg').show().html('用户名或密码错误')
                        } else {
                            location.href = '/index'
                        }
                    }
                })
            })
        })
    </script>
</head>
<body>
<div class="box">
    <h2>酒店后台管理系统</h2>
    {% csrf_token %}
    {#    <form action="/sdo/login_check" method="post">#}
    {#            {% csrf_token %}#}
    <div class="inputBox">
        <input type="text" name="username" id="username" required="" value="{{ username }}">
        <label>用户名</label>
    </div>
    <div class="inputBox" style="margin-top: 62px">
        <input type="password" name="password" id="password" required="" value="{{ password }}">
        <label>密码</label>
    </div>
    <div style="color: rgba(255, 255, 255, 0.44)">
        <input type="checkbox" name="remember" id="remember"/>记住用户名和密码<br/>
    </div>
    <div id="errormsg" style="display: none;color:red;  "></div>
    <!--            <input type="submit" name="" value="submit">-->
    <input id="imgLogin" type="image" src="../../static/image/login/submit.png" style="width: 60px">
    {#    </form>#}
</div>
</body>
</html>